﻿@{

}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-trasitional.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<script src="~/aa/vue/dist/vue.js"></script>
	<script src="~/aa/element-ui/lib/index.js"></script>
	<link href="~/aa/element-ui/lib/theme-chalk/index.css" rel="stylesheet" />
	<script src="~/aa/axios/dist/axios.js"></script>
	<script src="~/aa/echarts.js"></script>
	<link rel="stylesheet" href="../../css/table.css" type="text/css" />
	<title>无标题文档</title>
	<style type="text/css">
		body {
			background: rgb(253,244,227);
		}

		.TD_STYLE1 {
			background: #E6DDCE;
			/* color:white; */
		}

		.TD_STYLE2 {
			background: rgb(253,244,227);
		}

		.INPUT_STYLE2 {
			background: rgb(253,244,227);
		}
	</style>
</head>

<body>
	<div id="sg">
		<table width="100%">
			<tr>
				<td colspan="2" style="text-align: left">
					<font color="black">
						您正在做的业务是：人力资源--薪酬标准管理--薪酬发放登记
					</font>
				</td>
			</tr>
			<tr>
				<td colspan="2" style="text-align: right;">
					<input type="button" value="提交" v-on:click="SGInsert()" class="BUTTON_STYLE1">
					<input type="button" value="返回" class="BUTTON_STYLE1"
						   onclick="history.back();">
				</td>
			</tr>
		</table>
		<table id="co">
			<tbody class="table-row-group">
				<tr class="table-row-group">
					<td colspan="2" style="text-align: left">
						薪酬单编号：{{salaryStandardId}}<input type="hidden" id="SalaryStandardId" name="SalaryStandardId" />
					</td>
				</tr>
				<tr class="table-row-group">
					<td colspan="2" style="text-align: left">
						机构：{{value}}
					</td>
				</tr>
				<tr class="table-row-groups">
					<td style="text-align: left">
						本机构总人数:{{HumanAmount}}
						，基本薪酬总数:{{SalarySum}}
						，实发总额:{{SalaryPaidSum}}
					</td>
					<td class="align-right">
						<input type="hidden" id="HumanAmount" name="HumanAmount" v-model="HumanAmount" />
						<input type="hidden" id="SalaryStandardSum" name="SalaryStandardSum" v-model="SalarySum " />
						<input type="hidden" id="SalaryPaidSum" name="SalaryPaidSum" v-model="SalaryPaidSum " />
					</td>

					<td>
						<div class="align-right">
							登记人:<input type="text" id="Register" name="Register" value="@ViewBag.uname" />
							登记时间：{{RegistTime}}
							<input type="hidden" id="RegistTime" name="RegistTime" v-model="RegistTime" />
						</div>
					</td>
				</tr>
			</tbody>
		</table>
		<template>
			<el-table :data="tableData"
					  border
					  style="width: 100%">
				<el-table-column prop="hufId"
								 label="序号"
								 width="180">
				</el-table-column>
				<el-table-column prop="humanId"
								 label="档案编号"
								 width="180">
				</el-table-column>
				<el-table-column prop="humanName"
								 label="姓名">
				</el-table-column>
				<el-table-column prop="xx"
								 label="详细信息">
					<template slot-scope="scope">
						<el-button type="text" v-on:click="tk">详细信息</el-button>
					</template>
				</el-table-column>
				<el-table-column label="奖励金额" label-width="100px">
					<template slot-scope="scope">
						<el-input placeholder="奖励金额" v-model="scope.row.bounsSum"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="销售绩效总额" label-width="100px">
					<template slot-scope="scope">
						<el-input placeholder="销售绩效总额" v-model="scope.row.saleSum"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="应扣金额" label-width="100px">
					<template slot-scope="scope">
						<el-input placeholder="应扣金额" v-model="scope.row.deductSum"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="实发金额" label-width="100px">
					<template slot-scope="scope">
						<el-input v-model="calculateSalaryPaidSum[scope.$index]"></el-input>
					</template>
				</el-table-column>
			</el-table>
		</template>
		<template>
			<el-dialog title="详细内容"
					   :visible.sync="dialogVisible"
					   width="50%"
					   :before-close="handleClose">
				<el-table :data="otherData"
						  border
						  style="width: 100%">
					<el-table-column prop="standardId"
									 label="薪酬编号"
									 width="180">
					</el-table-column>
					<el-table-column prop="itemName"
									 label="项目名称"
									 width="180">
					</el-table-column>
					<el-table-column prop="salary"
									 label="金额">
					</el-table-column>
				</el-table>
				<span slot="footer" class="dialog-footer">
					<el-button v-on:click="dialogVisible = false">取 消</el-button>
					<el-button type="primary" v-on:click="dialogVisible = false">确 定</el-button>
				</span>
			</el-dialog>
		</template>
	</div>
	<script type="text/javascript">
		var vm = new Vue({
			el: "#sg",
			data: {
				dialogVisible: false,
				list: [],
				SGD: {
					BounsSum: "",
					SaleSum: "",
					DeductSum: "",
					SalaryPaidSum: "",
				},
				list2: [],
				where: "",
				salaryStandardId: "",
				SalarySum: "",
				tableData: [],
				otherData: [],
				HumanAmount: "",
				SalaryPaidSum: "",
				SalaryStandardSum: "",
				RegistTime: "",
				value: "",
				SalaryGrantId: "",
				FirstKindId: "",
				FirstKindName: "",
				SecondKindId: "",
				SecondKindName: "",
				ThirdKindId: "",
				ThirdKindName: "",
				Register: "",

			},
			methods: {
				handleClose: function () {
					this.dialogVisible = false;
				},
				fill() {
					/* var id = this.SalaryStandardId; */
					axios.get("/SG/SSDSelect", {
						params: {
							StandardId: this.salaryStandardId
						}
					}).then(res => {
						this.otherData = res.data;
						axios.get("/SG/GetHF", {
							params: {
								SalaryStandardId: this.salaryStandardId,
								tiao: this.where
							}
						}).then(res => {
							this.tableData = res.data.map(user => ({
								...user,
								bounsSum: "",
								saleSum: "",
								deductSum: "",
								otherData: this.otherData,
								salaryPaidSum: "",
							}));
						}).catch(err => {
							console.log(err);
						});
					}).catch(err => {
						console.log(err);
					});
				},
				tk() {
					this.dialogVisible = true;
				},
				updateTime() {
					setInterval(() => {
						const currentTime = new Date(); // 获取当前时间
						this.RegistTime = `${currentTime.getFullYear()}-${currentTime.getMonth() + 1}-${currentTime.getDate()} ${currentTime.getHours()}:${currentTime.getMinutes()}:${currentTime.getSeconds()}`; // 更新时间到 v-model 中
					}, 1000);
				},
				js() {
					axios.get("/SG/JS", {
						params: {
							SalaryStandardId: this.salaryStandardId
						}
					}).then(res => {
						this.HumanAmount = res.data;

					}).catch(err => {
						console.log(err);
					});
				},
				bh() {
					let characters = '0123456789';
					let now = new Date();
					let year = now.getFullYear(); // 当前年份
					let month = (now.getMonth() + 1).toString().padStart(2, '0'); // 当前月份
					let day = now.getDate().toString().padStart(2, '0'); // 当前日期
					let fileNumber = `FF${year}${month}${day}`;

					for (let i = 0; i < 10; i++) {
						fileNumber += characters.charAt(Math.floor(Math.random() * characters.length));
					}
					this.SalaryGrantId = fileNumber;
				},
				SGInsert() {
					/* console.log(this.salaryStandardId);
					console.log(this.FirstKindId);
					console.log(this.FirstKindName);
					console.log(this.SecondKindId);
					console.log(this.SecondKindName);
					console.log(this.ThirdKindId);
					console.log(this.ThirdKindName); */
					/* console.log(this.tableData); */
					this.bh();
					axios.get("/SG/GetInsert", {
						params: {
							SalaryGrantId: this.SalaryGrantId,
							SalaryStandardId: this.salaryStandardId,
							FirstKindId: this.FirstKindId,
							FirstKindName: this.FirstKindName,
							SecondKindId: this.SecondKindId,
							SecondKindName: this.SecondKindName,
							ThirdKindId: this.ThirdKindId,
							ThirdKindName: this.ThirdKindName,
							RegistTime: this.RegistTime,
							Register: this.Register,
							HumanAmount: this.HumanAmount,
							SalaryStandardSum: this.SalarySum,
							SalaryPaidSum: this.SalaryPaidSum
						}
					}).then(res => {
						if (res.data) {
							axios.get("/SG/GetSGDInsert", {
								params: {
									tableData: JSON.stringify(this.tableData),
								}
							}).then(res => {
								if (res.data) {
									alert("添加成功");
									window.location.href = '/SG/Query_List';
								} else {
									alert("添加失败");
								}
							}).catch(err => {
								console.log(err);
							});
						}
					}).catch(err => {
						console.log(err);
					});
				},
				SGDInsert() {

				},
			},
			computed: {
				calculateSalaryPaidSum() {
					return this.tableData.map(row => {
						const salary = row.otherData.reduce((total, column) => total + column.salary, 0);
						const bonus = parseFloat(row.bounsSum) || 0;
						const saleSum = parseFloat(row.saleSum) || 0;
						const deductSum = parseFloat(row.deductSum) || 0;

						row.salaryPaidSum = salary + bonus + saleSum - deductSum; // 更新 salaryPaidSum 字段
						this.SalaryPaidSum = row.salaryPaidSum;
						return row.salaryPaidSum;
					});
				},
			},
			mounted: function () {
				this.salaryStandardId = sessionStorage.getItem("SalaryStandardId");
				this.SalarySum = sessionStorage.getItem("SalarySum");
				this.where = sessionStorage.getItem("selectedValue");
				this.value = sessionStorage.getItem("selectedValue2");
				this.FirstKindId = sessionStorage.getItem("FirstKindId");
				this.FirstKindName = sessionStorage.getItem("FirstKindName");
				this.SecondKindId = sessionStorage.getItem("SecondKindId");
				this.SecondKindName = sessionStorage.getItem("SecondKindName");
				this.ThirdKindId = sessionStorage.getItem("ThirdKindId");
				this.ThirdKindName = sessionStorage.getItem("ThirdKindName");
				console.log("get:"+this.salaryStandardId);
				this.fill();
				this.updateTime();
				this.js();
			}
		});
	</script>
</body>
</html>